<%@ page language="java" contentType="text/html; charset=US-ASCII"
    pageEncoding="US-ASCII"%>
<%@ page import="structures.User"%>
<%@ page import="java.util.ArrayList"%>
<%@ page import="structures.AD"%>
<%@ page import="structures.ADsList"%>
<%@ page import="structures.GamifyResult"%>
<%	User user = (User) session.getAttribute("user");
	User seller = (User) session.getAttribute("seller");
	String idAdvertisement = (String) session.getAttribute("idAdvertisement");
	ArrayList<GamifyResult> gamifyResults = (ArrayList<GamifyResult>) session.getAttribute("gamifyResult");
	session.removeAttribute("gamifyResult");
	session.removeAttribute("idAdvertisement");
	session.removeAttribute("seller");
	ADsList adsSoldList = (ADsList) session.getAttribute("Sold");
	session.removeAttribute("Sold");
	ADsList adsAvailableList = (ADsList) session.getAttribute("Available");
	session.removeAttribute("Available");
	String imageSource = "http://localhost:8080/DatabaseRESTWebService/GetADImage?idAdvertisement=";
	
	int positiveFeedback=0, negativeFeedback=0, noFeedback=0;
	for(AD advertisement : adsSoldList.getAdsList()){
		if(advertisement.getFeedbackText()!=null){
			if(advertisement.getFeedbackValue()==1)
				positiveFeedback++;
			else
				negativeFeedback++;
		}else
			noFeedback++;
	}
	
	
	%>
	
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>TiVendoIo - Item</title>

    <!-- Bootstrap -->
    <link href="/serviceTechnologies/bootstrap/css/bootstrap.min.css" rel="stylesheet">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.0/css/font-awesome.css" rel="stylesheet">
    <link href="css/style.css" rel = "stylesheet">
    
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script src="/serviceTechnologies/bootstrap/js/bootstrap.js"></script>
    <script type="text/javascript">
	$(document).ready(function(){
		$('#footer').load('/serviceTechnologies/common/footer.jsp');
		$('#navbar').load('/serviceTechnologies/common/navbar.jsp');
	});
	</script>
	
	
	
	
	
	<script type="text/javascript" src="https://www.google.com/jsapi"></script>
	
 	<script type="text/javascript">
 	//global variables
 	var dataFilterParam ="", viewFilterParam ="", sinceParam ="", untilParam = "";
 // Load the Visualization API and the piechart package. 
	google.load('visualization', '1.0', {'packages':['corechart']});
	
	//This function call the servlet to obtain all the SNPosts which satisfyies the serch param (MeansOfTransportFilter) 
	//Once have the SNPosts this function creates their markers on the map
	
	$(document).ready(function() {
	
		
					//This function in invoked when the request has been accomplished by the server 
					
					// Create the data table.
					var dataChart = new google.visualization.DataTable();
					dataChart.addColumn('string', 'Topping');
					dataChart.addColumn('number', 'Slices');
					
					//AD with a positive feedback, without feedback or with negative feedback
					dataChart.addRows([["Positive feedback", <%=positiveFeedback%>]]);
					dataChart.addRows([["Negative feedback", <%=negativeFeedback%>]]);
					dataChart.addRows([["No feedback", <%=noFeedback%>]]);
					
					//create options text 
					var options;
					options = {'title':'Seller statistics'};
				    // Instantiate and draw our chart, passing in some options. 
				    var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
				    chart.draw(dataChart, options);
				
	});
	
	</script>
	
	
	
	
	
	
  </head>
  <body>
 	
 	<div id="navbar"></div>
 	
   <div class="container">
   <div class = "row">
   	<a href="./ShowAD?idAdvertisement=<%=idAdvertisement%>&WikiInfo=true">
	  	<button class="btn btn-default btn-primary btn-sm"><span class="glyphicon glyphicon-circle-arrow-left"></span> Back</button>
	</a>
   </div>
   <br>
   
   <div class="row">
   		<div class="col-md-3">
	    	<img src="http://www.localcrimenews.com/wp-content/uploads/2013/07/default-user-icon-profile.png"  alt="" class="img-rounded">
	    </div>
   		<div class="col-md-3">
			<blockquote>
	        	<p><%=seller.getName()%> <%=seller.getSurname()%></p>
	       	</blockquote>
	       	<p>
		        <i class="glyphicon glyphicon-envelope"></i> <%=seller.getEmail()%> <br>
		        <a href="https://www.facebook.com/<%=seller.getIdFacebook()%>" target="_blank">Facebook profile</a><br>
	   			<a href="https://plus.google.com/<%=seller.getIdGoogle()%>" target="_blank">Google plus profile</a><br>
	   			<a href="https://twitter.com/intent/user?user_id=<%=seller.getIdTwitter()%>" target="_blank">Twitter profile</a><br>
	      	</p>
		</div>
		<div class="col-md-6">
			 <!-- Pie Chart place -->
			 <div id="chart_div"></div>
		</div>
	</div>
	<br>
	<div class="row" style = "overflow-x:scroll; ">
				<h3>BADGES achieved:</h3>	

					<%if(gamifyResults==null||gamifyResults.size()==0){ %>
						<p align = "center">No badges achieved!!!!</p>
					<%}else{ %>
						<ul class="list-unstyled list-inline" >
						<%for(int i=0; i< gamifyResults.size(); i++){ %>
							<li style = "text-align: center;">
							<p>Badge name: <%=gamifyResults.get(i).getBadgesName()%></p><br>
							<img src="<%=gamifyResults.get(i).getBadgesUrl()%>" class ="img-rounded" id="Image1" alt="" align="top" border="0" style="width:194px;height:162px;"><br>		
							</li>
						<%}%>
						</ul>
					<%}%>
				<br>
		
		
  	</div>
  	<br>
  	<div class = "row">
  	
  		<ul class="nav nav-tabs">
		  <li class="active"><a href="#sold" data-toggle="tab">Sold Items</a></li>
		  <li><a href="#selling" data-toggle="tab">Selling Items</a></li>
		</ul>
		
		<div class="tab-content">
  	
	  		<div class="tab-pane active" id = "sold" style = "overflow-x:scroll; ">
	  					<h3>Advertisements Already Sold List </h3>
			
						<%if(adsSoldList==null || adsSoldList.getAdsList().size()==0){ %>
							<p align = "center">No Ads in the database!</p>
						<%  }else{
				  		%>
						
				  		<ul class="list-unstyled list-inline">
				  		<%for(AD advertisement: adsSoldList.getAdsList()){ 
				  			%>
				  			<li>
				  				
				   				Title:<%=advertisement.getTitle()%><br>
				   				Description:<%=advertisement.getDescription()%><br>
				   				Price:<%=advertisement.getPrice()%><br>
								<img src="<%=imageSource + advertisement.getIdAdvertisement()%>" id="Image1" alt="" align="top" border="0" style="width:194px;height:162px;"><br>
								<br>
								<a href="./ShowAD?idAdvertisement=<%=advertisement.getIdAdvertisement()%>&WikiInfo=true">
				  					<button class="btn btn-default btn-primary btn-sm"><span class="glyphicon glyphicon-eye-open"></span> Take a Look!</button>
				  				</a>
				  				<%if(advertisement.getFeedbackText()!=null && !advertisement.getFeedbackText().equals("null")){
				  							if(advertisement.getFeedbackValue()==1){%>
				  									<b>Positive!</b>
				  							<%  }else{%>
				  									<b>Negative!</b>
				  							<%}
				  				}else{%>
				  					<b>No feedback!</b>
				  				<%} %>		
				  			</li>	
				  		<%  }
						}
				  		%>
				  		</ul>
				  		
	  		</div>
	  		<div class="tab-pane" id = "selling" style = "overflow-x:scroll; ">
	  					<h3>Advertisements Still Available List </h3>
			
						<%if(adsAvailableList==null || adsAvailableList.getAdsList().size()==0){ %>
							<p align = "center">No Ads in the database!</p>
						<%  }else{
				  		%>
						
				  		<ul class="list-unstyled list-inline">
				  		<%for(AD advertisement: adsAvailableList.getAdsList()){ 
				  			%>
				  			<li>
				  				
				   				Title:<%=advertisement.getTitle()%><br>
				   				Description:<%=advertisement.getDescription()%><br>
				   				Price:<%=advertisement.getPrice()%><br>
								<img src="<%=imageSource + advertisement.getIdAdvertisement()%>" id="Image1" alt="" align="top" border="0" style="width:194px;height:162px;"><br>
								<br>
								<a href="./ShowAD?idAdvertisement=<%=advertisement.getIdAdvertisement()%>&WikiInfo=true">
				  					<button class="btn btn-default btn-primary btn-sm"><span class="glyphicon glyphicon-eye-open"></span> Take a Look!</button>
				  				</a>		
				  			</li>	
				  		<%  }
						}
				  		%>
				  		</ul>
	  		</div>
  		</div>
  	</div> <!-- End row -->
  	
  	<br>			
	
    </div> <!-- End Container -->
 	
 	<div id="footer">
      
    </div>
 	<!-- End footer -->
 	
 	
  </body>
 </html>